<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>自适应内部元素</title>
	<style>
		html, body{
			width: 100%;
			overflow: hidden;
		}
		.container{
			text-align: center;
			border: 1px solid;
			max-width: min-content;
		}
		@keyframes ani{
			from{
				width: 100px;
			}
			to{
				width: 500px;
			}
		}
		img{
			animation: ani 4s ease-in-out infinite;
		}

		.tb{
			display: table;
			table-layout: auto;
			max-width: 100%;
			overflow: hidden;
		}
		.container1{
			display: table-cell;
		}
		
	</style>
</head>
<body>
	min-content
	<div class="container">
		<img src="./img/bg.jpg"/>
		<p> 这里想（，说点题外话，我不是什么哲人，我的观点实际上都是比较肤浅的，而且每个人都有不同的哲学观，所以，本文不旨在改变什么，仅仅是表达一点自己的一些思考。
				道家是以老子、庄子为代表的中国春秋战国时期诸子百家中最重
		</p>
	</div>
	<br />
	<div class="tb">
		<div class="container1">
			<img src="./img/bg.jpg"/>
			<p> 这里想（，说点题外话，我不是什么哲人，我的观点实际上都是比较肤浅的，而且每个人都有不同的哲学观，所以，本文不旨在改变什么，仅仅是表达一点自己的一些思考。
					道家是以老子、庄子为代表的中国春秋战国时期诸子百家中最重
			</p>
		</div>
		<div class="container1" style="">
				aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
		</div>
	</div>
	
</body>
</html>